<template>
	<div class="cardContainer">
		<div class="card">
			<div class="videoCardContainer" style="margin-bottom: 50px">
				<el-card :body-style="{ padding: '0px' }">
					<img
						src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
						class="image"
					/>
					<div class="cardMiddle">
						<a>
							<span class="cardFlag">教程</span>
							大威天龙/大威天龙/大威天龙/大威天龙/
						</a>
						<span class="cardNum">1150浏览</span>
						<div class="iconInfo">
							<span>
								<svg
									t="1666082225027"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="4368"
									width="20"
									height="20"
								>
									<path
										d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z"
										p-id="4369"
										fill="#b1b5c1"
									></path>
								</svg>
								0
							</span>
							<span>
								<svg
									t="1666082073268"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="3122"
									width="20"
									height="20"
								>
									<path
										d="M486.4 682.666667c4.266667 0 4.266667 0 0 0H725.333333c46.933333 0 85.333333-38.4 85.333334-85.333334V341.333333c0-46.933333-38.4-85.333333-85.333334-85.333333H298.666667c-46.933333 0-85.333333 38.4-85.333334 85.333333v256c0 46.933333 38.4 85.333333 85.333334 85.333334h21.333333c12.8 0 21.333333 8.533333 21.333333 21.333333s-8.533333 21.333333-21.333333 21.333333H298.666667c-72.533333 0-128-55.466667-128-128V341.333333c0-72.533333 55.466667-128 128-128h426.666666c72.533333 0 128 55.466667 128 128v256c0 72.533333-55.466667 128-128 128h-230.4l-166.4 81.066667c-8.533333 4.266667-21.333333 0-29.866666-8.533333-4.266667-8.533333 0-21.333333 8.533333-29.866667l170.666667-85.333333h8.533333z"
										p-id="3123"
										fill="#b1b5c1"
									></path>
									<path
										d="M341.333333 469.333333m-42.666666 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3124"
										fill="#b1b5c1"
									></path>
									<path
										d="M512 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
										p-id="3125"
										fill="#b1b5c1"
									></path>
									<path
										d="M682.666667 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3126"
										fill="#b1b5c1"
									></path>
								</svg>
								5
							</span>
							<span>
								<svg
									t="1666082291857"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="5392"
									width="20"
									height="20"
								>
									<path
										d="M576.4 203.3c46.7 90.9 118.6 145.5 215.7 163.9 97.1 18.4 111.5 64.9 43.3 139.5s-95.6 162.9-82.3 265.2c13.2 102.3-24.6 131-113.4 86.2s-177.7-44.8-266.6 0-126.6 16-113.4-86.2c13.2-102.3-14.2-190.7-82.4-265.2-68.2-74.6-53.7-121.1 43.3-139.5 97.1-18.4 169-73 215.7-163.9 46.6-90.9 93.4-90.9 140.1 0z"
										p-id="5393"
										fill="#b1b5c1"
									></path>
								</svg>
								110
							</span>
						</div>
					</div>
					<div class="userInfo">
						<div class="left">
							<img src="../../assets/images/dog.jpg" />
							<span>致橡树</span>
						</div>
						<div class="right">
							<span title="2022年04月02日">04-02</span>
						</div>
					</div>
				</el-card>
			</div>
			<div class="videoCardContainer" style="margin-bottom: 50px">
				<el-card :body-style="{ padding: '0px' }">
					<img
						src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
						class="image"
					/>
					<div class="cardMiddle">
						<a>
							<span class="cardFlag">教程</span>
							大威天龙/大威天龙/大威天龙/大威天龙/
						</a>
						<span class="cardNum">1150浏览</span>
						<div class="iconInfo">
							<span>
								<svg
									t="1666082225027"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="4368"
									width="20"
									height="20"
								>
									<path
										d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z"
										p-id="4369"
										fill="#b1b5c1"
									></path>
								</svg>
								0
							</span>
							<span>
								<svg
									t="1666082073268"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="3122"
									width="20"
									height="20"
								>
									<path
										d="M486.4 682.666667c4.266667 0 4.266667 0 0 0H725.333333c46.933333 0 85.333333-38.4 85.333334-85.333334V341.333333c0-46.933333-38.4-85.333333-85.333334-85.333333H298.666667c-46.933333 0-85.333333 38.4-85.333334 85.333333v256c0 46.933333 38.4 85.333333 85.333334 85.333334h21.333333c12.8 0 21.333333 8.533333 21.333333 21.333333s-8.533333 21.333333-21.333333 21.333333H298.666667c-72.533333 0-128-55.466667-128-128V341.333333c0-72.533333 55.466667-128 128-128h426.666666c72.533333 0 128 55.466667 128 128v256c0 72.533333-55.466667 128-128 128h-230.4l-166.4 81.066667c-8.533333 4.266667-21.333333 0-29.866666-8.533333-4.266667-8.533333 0-21.333333 8.533333-29.866667l170.666667-85.333333h8.533333z"
										p-id="3123"
										fill="#b1b5c1"
									></path>
									<path
										d="M341.333333 469.333333m-42.666666 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3124"
										fill="#b1b5c1"
									></path>
									<path
										d="M512 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
										p-id="3125"
										fill="#b1b5c1"
									></path>
									<path
										d="M682.666667 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3126"
										fill="#b1b5c1"
									></path>
								</svg>
								5
							</span>
							<span>
								<svg
									t="1666082291857"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="5392"
									width="20"
									height="20"
								>
									<path
										d="M576.4 203.3c46.7 90.9 118.6 145.5 215.7 163.9 97.1 18.4 111.5 64.9 43.3 139.5s-95.6 162.9-82.3 265.2c13.2 102.3-24.6 131-113.4 86.2s-177.7-44.8-266.6 0-126.6 16-113.4-86.2c13.2-102.3-14.2-190.7-82.4-265.2-68.2-74.6-53.7-121.1 43.3-139.5 97.1-18.4 169-73 215.7-163.9 46.6-90.9 93.4-90.9 140.1 0z"
										p-id="5393"
										fill="#b1b5c1"
									></path>
								</svg>
								110
							</span>
						</div>
					</div>
					<div class="userInfo">
						<div class="left">
							<img src="../../assets/images/dog.jpg" />
							<span>致橡树</span>
						</div>
						<div class="right">
							<span title="2022年04月02日">04-02</span>
						</div>
					</div>
				</el-card>
			</div>
			<div class="videoCardContainer" style="margin-bottom: 50px">
				<el-card :body-style="{ padding: '0px' }">
					<img
						src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
						class="image"
					/>
					<div class="cardMiddle">
						<a>
							<span class="cardFlag">教程</span>
							大威天龙/大威天龙/大威天龙/大威天龙/
						</a>
						<span class="cardNum">1150浏览</span>
						<div class="iconInfo">
							<span>
								<svg
									t="1666082225027"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="4368"
									width="20"
									height="20"
								>
									<path
										d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z"
										p-id="4369"
										fill="#b1b5c1"
									></path>
								</svg>
								0
							</span>
							<span>
								<svg
									t="1666082073268"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="3122"
									width="20"
									height="20"
								>
									<path
										d="M486.4 682.666667c4.266667 0 4.266667 0 0 0H725.333333c46.933333 0 85.333333-38.4 85.333334-85.333334V341.333333c0-46.933333-38.4-85.333333-85.333334-85.333333H298.666667c-46.933333 0-85.333333 38.4-85.333334 85.333333v256c0 46.933333 38.4 85.333333 85.333334 85.333334h21.333333c12.8 0 21.333333 8.533333 21.333333 21.333333s-8.533333 21.333333-21.333333 21.333333H298.666667c-72.533333 0-128-55.466667-128-128V341.333333c0-72.533333 55.466667-128 128-128h426.666666c72.533333 0 128 55.466667 128 128v256c0 72.533333-55.466667 128-128 128h-230.4l-166.4 81.066667c-8.533333 4.266667-21.333333 0-29.866666-8.533333-4.266667-8.533333 0-21.333333 8.533333-29.866667l170.666667-85.333333h8.533333z"
										p-id="3123"
										fill="#b1b5c1"
									></path>
									<path
										d="M341.333333 469.333333m-42.666666 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3124"
										fill="#b1b5c1"
									></path>
									<path
										d="M512 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
										p-id="3125"
										fill="#b1b5c1"
									></path>
									<path
										d="M682.666667 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3126"
										fill="#b1b5c1"
									></path>
								</svg>
								5
							</span>
							<span>
								<svg
									t="1666082291857"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="5392"
									width="20"
									height="20"
								>
									<path
										d="M576.4 203.3c46.7 90.9 118.6 145.5 215.7 163.9 97.1 18.4 111.5 64.9 43.3 139.5s-95.6 162.9-82.3 265.2c13.2 102.3-24.6 131-113.4 86.2s-177.7-44.8-266.6 0-126.6 16-113.4-86.2c13.2-102.3-14.2-190.7-82.4-265.2-68.2-74.6-53.7-121.1 43.3-139.5 97.1-18.4 169-73 215.7-163.9 46.6-90.9 93.4-90.9 140.1 0z"
										p-id="5393"
										fill="#b1b5c1"
									></path>
								</svg>
								110
							</span>
						</div>
					</div>
					<div class="userInfo">
						<div class="left">
							<img src="../../assets/images/dog.jpg" />
							<span>致橡树</span>
						</div>
						<div class="right">
							<span title="2022年04月02日">04-02</span>
						</div>
					</div>
				</el-card>
			</div>
			<div class="videoCardContainer" style="margin-bottom: 50px">
				<el-card :body-style="{ padding: '0px' }">
					<img
						src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
						class="image"
					/>
					<div class="cardMiddle">
						<a>
							<span class="cardFlag">教程</span>
							大威天龙/大威天龙/大威天龙/大威天龙/
						</a>
						<span class="cardNum">1150浏览</span>
						<div class="iconInfo">
							<span>
								<svg
									t="1666082225027"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="4368"
									width="20"
									height="20"
								>
									<path
										d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z"
										p-id="4369"
										fill="#b1b5c1"
									></path>
								</svg>
								0
							</span>
							<span>
								<svg
									t="1666082073268"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="3122"
									width="20"
									height="20"
								>
									<path
										d="M486.4 682.666667c4.266667 0 4.266667 0 0 0H725.333333c46.933333 0 85.333333-38.4 85.333334-85.333334V341.333333c0-46.933333-38.4-85.333333-85.333334-85.333333H298.666667c-46.933333 0-85.333333 38.4-85.333334 85.333333v256c0 46.933333 38.4 85.333333 85.333334 85.333334h21.333333c12.8 0 21.333333 8.533333 21.333333 21.333333s-8.533333 21.333333-21.333333 21.333333H298.666667c-72.533333 0-128-55.466667-128-128V341.333333c0-72.533333 55.466667-128 128-128h426.666666c72.533333 0 128 55.466667 128 128v256c0 72.533333-55.466667 128-128 128h-230.4l-166.4 81.066667c-8.533333 4.266667-21.333333 0-29.866666-8.533333-4.266667-8.533333 0-21.333333 8.533333-29.866667l170.666667-85.333333h8.533333z"
										p-id="3123"
										fill="#b1b5c1"
									></path>
									<path
										d="M341.333333 469.333333m-42.666666 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3124"
										fill="#b1b5c1"
									></path>
									<path
										d="M512 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
										p-id="3125"
										fill="#b1b5c1"
									></path>
									<path
										d="M682.666667 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3126"
										fill="#b1b5c1"
									></path>
								</svg>
								5
							</span>
							<span>
								<svg
									t="1666082291857"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="5392"
									width="20"
									height="20"
								>
									<path
										d="M576.4 203.3c46.7 90.9 118.6 145.5 215.7 163.9 97.1 18.4 111.5 64.9 43.3 139.5s-95.6 162.9-82.3 265.2c13.2 102.3-24.6 131-113.4 86.2s-177.7-44.8-266.6 0-126.6 16-113.4-86.2c13.2-102.3-14.2-190.7-82.4-265.2-68.2-74.6-53.7-121.1 43.3-139.5 97.1-18.4 169-73 215.7-163.9 46.6-90.9 93.4-90.9 140.1 0z"
										p-id="5393"
										fill="#b1b5c1"
									></path>
								</svg>
								110
							</span>
						</div>
					</div>
					<div class="userInfo">
						<div class="left">
							<img src="../../assets/images/dog.jpg" />
							<span>致橡树</span>
						</div>
						<div class="right">
							<span title="2022年04月02日">04-02</span>
						</div>
					</div>
				</el-card>
			</div>
			<div class="videoCardContainer" style="margin-bottom: 50px">
				<el-card :body-style="{ padding: '0px' }">
					<img
						src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
						class="image"
					/>
					<div class="cardMiddle">
						<a>
							<span class="cardFlag">教程</span>
							大威天龙/大威天龙/大威天龙/大威天龙/
						</a>
						<span class="cardNum">1150浏览</span>
						<div class="iconInfo">
							<span>
								<svg
									t="1666082225027"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="4368"
									width="20"
									height="20"
								>
									<path
										d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z"
										p-id="4369"
										fill="#b1b5c1"
									></path>
								</svg>
								0
							</span>
							<span>
								<svg
									t="1666082073268"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="3122"
									width="20"
									height="20"
								>
									<path
										d="M486.4 682.666667c4.266667 0 4.266667 0 0 0H725.333333c46.933333 0 85.333333-38.4 85.333334-85.333334V341.333333c0-46.933333-38.4-85.333333-85.333334-85.333333H298.666667c-46.933333 0-85.333333 38.4-85.333334 85.333333v256c0 46.933333 38.4 85.333333 85.333334 85.333334h21.333333c12.8 0 21.333333 8.533333 21.333333 21.333333s-8.533333 21.333333-21.333333 21.333333H298.666667c-72.533333 0-128-55.466667-128-128V341.333333c0-72.533333 55.466667-128 128-128h426.666666c72.533333 0 128 55.466667 128 128v256c0 72.533333-55.466667 128-128 128h-230.4l-166.4 81.066667c-8.533333 4.266667-21.333333 0-29.866666-8.533333-4.266667-8.533333 0-21.333333 8.533333-29.866667l170.666667-85.333333h8.533333z"
										p-id="3123"
										fill="#b1b5c1"
									></path>
									<path
										d="M341.333333 469.333333m-42.666666 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3124"
										fill="#b1b5c1"
									></path>
									<path
										d="M512 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
										p-id="3125"
										fill="#b1b5c1"
									></path>
									<path
										d="M682.666667 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3126"
										fill="#b1b5c1"
									></path>
								</svg>
								5
							</span>
							<span>
								<svg
									t="1666082291857"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="5392"
									width="20"
									height="20"
								>
									<path
										d="M576.4 203.3c46.7 90.9 118.6 145.5 215.7 163.9 97.1 18.4 111.5 64.9 43.3 139.5s-95.6 162.9-82.3 265.2c13.2 102.3-24.6 131-113.4 86.2s-177.7-44.8-266.6 0-126.6 16-113.4-86.2c13.2-102.3-14.2-190.7-82.4-265.2-68.2-74.6-53.7-121.1 43.3-139.5 97.1-18.4 169-73 215.7-163.9 46.6-90.9 93.4-90.9 140.1 0z"
										p-id="5393"
										fill="#b1b5c1"
									></path>
								</svg>
								110
							</span>
						</div>
					</div>
					<div class="userInfo">
						<div class="left">
							<img src="../../assets/images/dog.jpg" />
							<span>致橡树</span>
						</div>
						<div class="right">
							<span title="2022年04月02日">04-02</span>
						</div>
					</div>
				</el-card>
			</div>
			<div class="videoCardContainer" style="margin-bottom: 50px">
				<el-card :body-style="{ padding: '0px' }">
					<img
						src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
						class="image"
					/>
					<div class="cardMiddle">
						<a>
							<span class="cardFlag">教程</span>
							大威天龙/大威天龙/大威天龙/大威天龙/
						</a>
						<span class="cardNum">1150浏览</span>
						<div class="iconInfo">
							<span>
								<svg
									t="1666082225027"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="4368"
									width="20"
									height="20"
								>
									<path
										d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z"
										p-id="4369"
										fill="#b1b5c1"
									></path>
								</svg>
								0
							</span>
							<span>
								<svg
									t="1666082073268"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="3122"
									width="20"
									height="20"
								>
									<path
										d="M486.4 682.666667c4.266667 0 4.266667 0 0 0H725.333333c46.933333 0 85.333333-38.4 85.333334-85.333334V341.333333c0-46.933333-38.4-85.333333-85.333334-85.333333H298.666667c-46.933333 0-85.333333 38.4-85.333334 85.333333v256c0 46.933333 38.4 85.333333 85.333334 85.333334h21.333333c12.8 0 21.333333 8.533333 21.333333 21.333333s-8.533333 21.333333-21.333333 21.333333H298.666667c-72.533333 0-128-55.466667-128-128V341.333333c0-72.533333 55.466667-128 128-128h426.666666c72.533333 0 128 55.466667 128 128v256c0 72.533333-55.466667 128-128 128h-230.4l-166.4 81.066667c-8.533333 4.266667-21.333333 0-29.866666-8.533333-4.266667-8.533333 0-21.333333 8.533333-29.866667l170.666667-85.333333h8.533333z"
										p-id="3123"
										fill="#b1b5c1"
									></path>
									<path
										d="M341.333333 469.333333m-42.666666 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3124"
										fill="#b1b5c1"
									></path>
									<path
										d="M512 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
										p-id="3125"
										fill="#b1b5c1"
									></path>
									<path
										d="M682.666667 469.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333333 0 42.666667 42.666667 0 1 0-85.333333 0Z"
										p-id="3126"
										fill="#b1b5c1"
									></path>
								</svg>
								5
							</span>
							<span>
								<svg
									t="1666082291857"
									class="icon"
									viewBox="0 0 1024 1024"
									version="1.1"
									xmlns="http://www.w3.org/2000/svg"
									p-id="5392"
									width="20"
									height="20"
								>
									<path
										d="M576.4 203.3c46.7 90.9 118.6 145.5 215.7 163.9 97.1 18.4 111.5 64.9 43.3 139.5s-95.6 162.9-82.3 265.2c13.2 102.3-24.6 131-113.4 86.2s-177.7-44.8-266.6 0-126.6 16-113.4-86.2c13.2-102.3-14.2-190.7-82.4-265.2-68.2-74.6-53.7-121.1 43.3-139.5 97.1-18.4 169-73 215.7-163.9 46.6-90.9 93.4-90.9 140.1 0z"
										p-id="5393"
										fill="#b1b5c1"
									></path>
								</svg>
								110
							</span>
						</div>
					</div>
					<div class="userInfo">
						<div class="left">
							<img src="../../assets/images/dog.jpg" />
							<span>致橡树</span>
						</div>
						<div class="right">
							<span title="2022年04月02日">04-02</span>
						</div>
					</div>
				</el-card>
			</div>
		</div>
	</div>
</template>

<script setup lang="ts"></script>

<style scoped>
.cardContainer {
	width: 100%;
	background-color: #f5f7f9;
}
.card {
	width: 1200px;
	background-color: white;
	margin: 0 auto;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: wrap;
}
.videoCardContainer {
	width: 224px;
	height: 280px;
	font-size: 14px;
	background-color: white;
	border-radius: 5px;
}

.cardMiddle {
	padding: 10px 0 10px 13px;
	border-bottom: 1px solid #ebeced;
	height: 104px;
	box-sizing: border-box;
}

.cardMiddle .cardFlag {
	font-size: 12px;
	border: 1px solid black;
	border-radius: 4px;
	box-sizing: border-box;
	margin-right: 4px;
	display: inline-block;
	width: 26px;
	height: 16px;
	text-align: center;
	line-height: 16px;
}

.cardNum {
	display: block;
	font-size: 12px;
	line-height: 32px;
	color: #b1b5c1;
}

.iconInfo span {
	font-size: 12px;
	/* display:inline-block; */
	margin-right: 6px;
}

.iconInfo span svg {
	vertical-align: bottom;
}

.userInfo {
	width: 100%;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 12px;
	padding: 0 16px;
	box-sizing: border-box;
}

.userInfo .left img {
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin-right: 5px;
	border-radius: 50%;
}

.image {
	width: 224px;
	height: 126px;
	display: block;
}
</style>
